<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>查询子节点</title>
    <style>
        .mycolor {
            color: #fff;
            background-color: #F8DD88;
        }

        .steam {
            color: red;
        }
    </style>
</head>
<body>
<ul id="ul"
><li id="ali">油条</li
><li id="bli">包子</li
><li id="cli"><a id="yufen">米饺</a></li
><li id="dli">鱼粉</li
></ul>
<script>
    //查找子节点
    var tempel=document.getElementById("ul");
    var firstNode=tempel.firstChild;
    firstNode.className='mycolor';
    var lastNode=tempel.lastChild;
    lastNode.className='mycolor';
</script>
</body>
</html>